<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="stylesheet" type="text/css" href="/static/bootstrap.css">
<script src="/static/jquery.js"></script>
<script src='/static/bootstrap.js'></script>
<title>个人主页</title>
<style type="text/css">
body{
	margin-top:60px;
}
footer{
	margin-bottom: 50px;
	margin-top: 50px;
	left: 400px;
}
.list-group-item{
	margin-bottom: 15px;
}
.reason{
    position: fixed;
    top:300px;
    left:600px;
    width: 400px;
    height: 300px; 
    padding: 15px;
    display: none;
}

</style>
</head>
<body>
<div class='container'>
 <h1  class='page-header text-center'>
     <mark>{:cookie('user')['uname']}</mark>的个人主页
     <span class='label pull-right'><a href="{:url('index/index/index')}">首页</a></span>
 </h1>
 <div class="row">
 	<div class='col-md-4'>
 		<img src="/uploads/{:cookie('user')['image']}" alt="" class='img-circle' width="100%">
 	</div>
    <div class="col-md-8">
    	<ul class='list-group'>
    	 <li class="list-group-item  list-group-item-info">
              username:<span class='badge'>{:cookie('user')['uname']}</span>
         </li>
    	 <li class="list-group-item list-group-item-success" >
            email:<span class='badge'>{:cookie('user')['email']}</span>
         </li>
    	 <li class="list-group-item list-group-item-warning">
            tel:<span class='badge'>{:cookie('user')['tel']}</span>
         </li>
    	 <li class="list-group-item list-group-item-danger">
            创建时间:<span class='badge'>{:date('y-m-d h:i',cookie('user')['create_time'])}</span>
         </li>
    	 <li class="list-group-item list-group-item-active">
            身份:<span class='badge'>{:switchUser(cookie('user')['status'])}</span>
         </li>
    	</ul>
    </div>
 </div>
 <div class="row">
 	<div class="col-md-6 left" style='background: #CDCDB4;margin-top: 20px;min-height: 500px;'>
 		<h1 class="page-header  text-center">发布的记录</h1>
        <ul class='list-group'>
        	{volist name='message' id='message'}
            <li class='list-group-item'>
        	    <a href="{:url('detail/index',['id'=>$message['id']])}">
                 <h2>{$message.mname}</h2>   
                </a>
        	    <p>{$message.des}</p>
        	    <div class="label label-primary">
                  {:date('y-m-d h:i',$message.create_time)}
                </div>
                <span class="badge">{$message.status|status}</span>
        	</li>
            {/volist}
        </ul>
 	</div>
    <div class="col-md-6 right" style='background: #CAE1FF;margin-top: 20px;min-height: 500px;'>
 		<h1 class="page-header text-center">下订单的记录</h1>
        {volist name='hand' id='hand'}
        <li class='list-group-item' >
        	    <a href="{:url('detail/index',['id'=>$hand['mid']])}">
                   <h2>{$hand.mname}
                   <a class="btn btn-danger pull-right cancel" href='javascript:' hid="{$hand.hid}">
                     取消订单
                   </a>
                 </h2>
                </a>
        	    <h3>发布订单人：<span class='pull-right'>{$hand.xname}</span></h3>
                <h3>联系方式：<span class='pull-right'>{$hand.tel}</span></h3>
        	    <div class="label label-primary">
                  {:date('y-m-d h:i',$hand.create_time)}
                </div>
                <div class="reason bg-danger">
                     <h3 class="page-header" >请写出你的理由
                     <span class='close' style="font-size:40px;">&times;</span>
                     </h3>
                     <form method="post" action="{:url('detail/cancel')}">
                         <input type="hidden" name='hid' value="{$hand.hid}" >
                         <input type="hidden" name='mid' value="{$hand.mid}" >
                         <textarea name="reason" cols="48" rows="6" id='reason'></textarea>
                         <button class='btn btn-primary pull-right' id='submit' hid="{$hand.hid}" mid="{$hand.mid}">submit</button>
                     </form>
                </div>
        </li>
        {/volist}
 	</div>
 </div>
</div>
<footer style="margin-bottom: 50px;
               margin-top: 50px;
               left: 400px;">
	<p class='text-center bg-success ' style="font-size: 25px;"><span class='glyphicon glyphicon-plane'></span><br><mark>www.powerli.xyz</mark></p>
</footer>

</body>
<script >
$('body').hide();
$('body').fadeIn(1000);
//点击取消弹出对话框
$('.cancel').click(function(){
  yn=confirm('是否确定要取消，取消会影响你的信誉！')
  if(yn){
    $('.reason').show();
  }
});
//ajax去取消订单、
$('#submit').click(function(){
    $(this).parent().hide();
    // obj=$(this);
    // reason=$('#reason').val();
    // hid=$(this).attr('hid');
    // mid=$(this).attr('mid');
    // $.post("{:url('detail/cancel')}",{'hid':hid,'mid':mid,'reason':reason},function(e){
    //     if(e==1){
    //         alert('取消订单成功');
    //         obj.parent().parent().hide();
    //     }else{
    //         alert('取消订单失败');
    //     }
    // });
    
});

</script>
</html>